今天要把輸入框內的內容轉為json格式做傳輸

fetch('http://localhost:8000/blogs',{
      method:'POST',
      headers: {"Content-Type":"application/json" },
      body: JSON.stringify(blog)
    }).then(()=>{
      console.log('new blog added'); 
      setIsPending(false);
    })
    history.push('/');

這串fetch()被包在handlesubmit裡，當我們在輸入框填入資訊，並按下Add blog做submit的時候，
使用 fetch 函式發送 POST 請求至 http://localhost:8000/blogs，
用於新增一篇部落格 (blog)。
在請求中，指定了 Content-Type 標頭為 "application/json"，表明送出的資料是 JSON 格式。
之後將 blog 物件轉換為 JSON 字串，並放入請求的主體 (body) 中，
最後再用 react router 的usehistory hook，回到有所有部落格列表的主頁面。
history.push('/')

新增之後也可以刪除，我們製作一個delete button，並設一個函示去處理，

const handleClick =()=>{
    fetch('http://localhost:8000/blogs/'+blog.id,{
      method:'DELETE'
    }).then(()=>{
        history.push('/')
    })
  }

先用fetch()，發送 HTTP DELETE 請求，使用 blog.id 來指定要刪除的部落格資源。
method: 'DELETE' 代表指定了 HTTP 請求方法為 DELETE，表示要刪除指定的資源。
最後同樣將瀏覽器導向到根目錄，表示刪除成功後返回首頁。

參考資料

Net ninja